<template>
  <div class="hello">
    <!-- 头部 -->
    <header_slot></header_slot>
    <!-- 搜索栏 -->
    <select_slot></select_slot>
    <div class="list"><listtree_slot></listtree_slot></div>
    <!-- 为你推荐 -->
    <recommend_to_you></recommend_to_you>
    <!-- 尾部 -->
    <footer_slot></footer_slot>
  </div>
</template>

<script>
import header_slot from "./header-slot";
import select_slot from "./select-slot";
import footer_slot from "./footer-slot";
import listtree_slot from "./listtree-slot";
import recommend_to_you from "./recommend-to-you";
export default {
  components: {
    header_slot,
    select_slot,
    footer_slot,
    listtree_slot,
    recommend_to_you,
  },
  name: "HelloWorld",
  data() {
    return {
      msg: "Welcome to Your Vue.js App",
    };
  },
  mounted() {
    // axios({
    //   url: "http://api_dev.wanxikeji.cn/api/goodList",
    //   methods: "post",
    //   data: {
    //     size: 2,
    //   },
    // });
    // axios.post("http://localhost:9500/CommodityType/listTree").then((res) => {
    // });
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.hello {
  background-color: #f4f4f4;
}
.hello .list {
  margin-top: 10px;
}
</style>
